
new Vue({

    data:{
        newsTagId:1,// 当前分类的id
        newsTags:[],
        articles:[],
        paginate:{}, //分页数据
        loading:false,
        currentTagName : '',
        nameMap:{
            news:'企业动态',
            report:'公司报道',
            information:'行业资讯',
            technology:'技术更新',
            
        },
        titleMap:{
            '公司报道': 'Company News',
            '行业动态': 'Industry Information',
            '眼镜知识': 'Spectacle Knowledge'
        },
    } ,

    filters: {
        getArticleTitle: function (article) {
            if( document.getElementsByTagName('html')[0].lang === 'zh' ){
               return article.title;
            }else{
               return article.english_title;
            }
        },
        titleOverflow: function (title) {
            if( title.length > 110 ){
                return title.substr(0,100) + '...';
            }
            return title;
        },

        getDescription: function (article) {
            if( document.getElementsByTagName('html')[0].lang === 'zh' ){
                return article.description;
            }else{
                return article.english_description;
            }
        },

        descriptionOverflow: function (description) {
            if( document.getElementsByTagName('html')[0].lang === 'zh' ){
                var len = 120;
            }else{
                var len = 260;
            }
            if( description && description.length > len ){
                return description.substr(0,len) + '...';
            }
            return description;
        }
    },
    
    methods:{
        trans:function (title) {
            if( document.getElementsByTagName('html')[0].lang === 'zh' ) return title;
            return this.titleMap[title];
        },

        getNewsList:function(page){
            page = page || 1;
            var self = this;
            if( !self.loading ){
                self.loading = true;
                self.$http.get('/api/web-page/news-article?page='+page+'&per_page=8&tag_id='+self.newsTagId).then(function(response){
                    if( response.body.code !== 0 ){
                        throw new Error('获取新闻摘要列表失败，code: '+response.body.code)
                    }
                    self.articles = response.body['articles_paginate'].data;
                    delete response.body['articles_paginate'].data;
                    self.paginate = response.body['articles_paginate'];
                    self.loading = false;
                });
            }
        },

        //切换分类
        changeTag:function(id){
            this.newsTagId = Number(id);
            this.getNewsList();
        },

        //切换分页
        changePage:function(number){
            this.getNewsList(number);
        }
    },

    mounted:function(){
        var self = this;
        //获取文章分类
        self.loading = true;
        self.$http.get('api/web-page/news-article/create').then(function(response){
            if( Number(response.body.code) !== 0 ){
                throw Error('获取新闻分类失败，code: '+response.body.code)
            }

            //查找分类
            var newsCategory =  _.find(response.body.tags,function(el){
                return el.name === '新闻动态' ;
            });

            //过滤分类
            self.newsTags = _.filter( newsCategory['sub_tag'], function(el){
               return _.contains( _.values(self.nameMap), el.name );
            } );


            //查找
            var newsTag = _(self.newsTags).find(function(el){
                return self.nameMap[self.currentTagName] === el.name
            });

            //如果有hash值把分类传入则，查找该分类的id
            self.newsTagId =  typeof newsTag === "object"? newsTag.id : self.newsTagId;


            //设置当前分类的id
            self.loading = false;

            //请求新闻列表
            self.getNewsList();

        }).catch(function(error){
            throw  error;
        });


        //监听其他页面传入tagName
        self.currentTagName = location.hash.replace('#',"") || '' ;

        window.onhashchange = function(){
            location.reload();
        }

    },

    components:{
        bymPagination: bymPagination
    }
}).$mount("#dynamic");